<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="renderer" content="webkit">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=10, user-scalable=no">
	<meta name="format-detection" content="telphone=no, email=no"/>
	<meta name="description" content="">
	<meta name="keywords" content="">
	<title>环保数据管家</title>
	<link rel="stylesheet" type="text/css" href="assets/css/reset.css">
	<link rel="stylesheet" type="text/css" href="assets/css/iconfont/iconfont.css">
	<link rel="stylesheet" type="text/css" href="assets/css/order.css">
	<style type="text/css">
	tr.active td{
		color: #21AC3C;
	}
	.constwidth{
		width: 1rem!important;
	}
	</style>
</head>
<body>
	<header>
		<span id="app-back" class="app-back"><i class="iconfont icon-left"></i></span>
		<span class="title">环保数据管家</span>
	</header>
	<div class="order-btns flex-row">
		<span data-idx="0" class="order-btns-item flex-row-item active">省内排名</span>
		<span data-idx="1" class="order-btns-item flex-row-item">74城市排名</span>
	</div>
	<div class="order-tables">
		<div class="order-title">江苏省空气质量排名</div>
		<!-- <span class="order-date-btn">选择月份<i class="iconfont icon-unfold"></i></span> -->
		<span class="order-date"></span>
		<div class="sorttable">
			<div class="sorttable-header flex-row">
				<span class="flex-row-item">序号</span>
				<span class="flex-row-item">城市</span>
				<span class="flex-row-item">AQI</span>
			</div>
			<div id="sorttable" class="sorttable-bodyer">
				
			</div>
		</div>
	</div>
	<footer class="flex-row">
		<span id="app-main-link" class="flex-row-item"><i class="iconfont icon-weather"></i> 空气质量监测</span>
		<span id="app-middle-link" class="flex-row-item"><i class="iconfont icon-liuliangxinxishangbao"></i> 空气质量分析</span>
		<span id="app-map-link" class="flex-row-item"><i class="iconfont icon-iconfontweizhi"></i> 目标考核</span>
		
	</footer>
</body>
<script src="assets/js/jquery.js"></script>
<script src="assets/js/touch.min.js"></script>
<script>
	var idx=location.hash==='#js'?0:1;
	var jsorder=[],csjorder=[];
	var JSCitys  = '盐城市,南通市,扬州市,泰州市,镇江市,宿迁市,苏州市,淮安市,常州市,连云港市,无锡市,南京市,徐州市';
	var CSJCitys = '拉萨,海口,昆明,惠州,厦门,舟山,张家口,福州,深圳,中山,珠海,大连,台州,肇庆,贵阳,南昌,佛山,东莞,广州,丽水,承德,南宁,江门,盐城,衢州,西宁,温州,合肥,上海,淮安,宁波,扬州,泰州,宿迁 ,连云港,兰州,镇江,青岛,杭州,嘉兴,湖州,绍兴,南通,呼和浩特,苏州,无锡,南京,北京,金华,长沙,常州,秦皇岛,廊坊,重庆,徐州,西安,长春,乌鲁木齐,沧州,成都,武汉,天津,太原 ,唐山,银川,哈尔滨,济南,沈阳,衡水,郑州,邯郸,石家庄,邢台,保定';

	// 省内城市
	getJSONData("./map",function(data){
		if(data.Error==null){
			data.Data.forEach(function(e){
				if(JSCitys.indexOf(e.name)>-1&&e.name!='南京市'){
					jsorder.push({name:e.name,aqinum:e.aqi});
				}
				console.log(RMS(e.name),CSJCitys.indexOf(RMS(e.name)));
				if(CSJCitys.indexOf(RMS(e.name))>-1&&e.name!='南京市'){
					csjorder.push({name:e.name,aqinum:e.aqi});
				}
			});
		}
		// // 南京监测点
		getJSONData("./data?act=aqin&areacode=2000",function(data){
			if(data.Error==null){
				var d=data.Data;
				// for(var i in d){
					// if(d[i].name=='市区'){
						jsorder.push({name:'南京市',aqinum:d[0].aqi});
						csjorder.push({name:'南京市',aqinum:d[0].aqi});
					// }
				// }
			}
			jsorder=jsorder.sort(function(a,b){
				var i=-1,an=parseInt(a.aqinum),bn=parseInt(b.aqinum);
				if(an==bn){
					if(RMS(a.name)=='南京市') i=-1;
					if(RMS(b.name)=='南京市') i=1;
				}else{
					i=an-bn;
				}
				return i
			});
			// csjorder=[].concat(csjorder,jsorder);
			csjorder.sort(function(a,b){
				var i=-1,an=parseInt(a.aqinum),bn=parseInt(b.aqinum);
				if(an==bn){
					if(RMS(a.name)=='南京市') i=-1;
					if(RMS(b.name)=='南京市') i=1;
				}else{
					i=an-bn;
				}
				return i
			});
			setOrderbtnsActive(idx);
		});
	});

	function setOrderbtnsActive(idx){
		$('.order-btns-item').removeClass('active').eq(idx).addClass('active');
		$('.order-title').html(idx==0?'江苏省空气质量排名':'74城市空气质量排名');
		setOrderTable(idx);
	}

	function setOrderTable(key){
		var html='',cache=key==0?jsorder:csjorder;
		cache.forEach(function(e,i){
			html+='<div class="flex-row '+(e.name.replace('市','')=="南京"?'active':'')+'">\
			<span class="flex-row-item">'+(++i)+'</span>\
			<span class="flex-row-item">'+e.name+'</span>\
			<span class="flex-row-item">'+e.aqinum+'</span>\
		</div>';
		});
		$('#sorttable').html(html);
	}

	touch.on('.order-btns-item', 'tap', function(ev){
	  var idx=ev.target.getAttribute('data-idx');
	  setOrderbtnsActive(idx);
	});
	touch.on('#app-back', 'tap', function(ev){
	  history.back();
	});
	touch.on('#app-main-link', 'tap', function(ev){
	  location.href='index.html';
	});
	touch.on('#app-middle-link', 'tap', function(ev){
	  location.href='air-quality.html';
	});
	touch.on('#app-map-link', 'tap', function(ev){
	  location.href='map.html';
	});

	function getJSONData(url,callback){
      $.ajax({
          type: "get",
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          url: url,  //这里是网址
          success: function (json) {
              callback(json)
          },
          timeout: 1000*90,
          error: function (XMLHttpRequest, textStatus, errorThrown) {
              console.error(url,textStatus+": "+errorThrown);
          }
      });
  }
  function RMS(s){
  	return s.replace('市','');
  }
</script>
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan style='display:none;' id='cnzz_stat_icon_1259663969'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s4.cnzz.com/z_stat.php%3Fid%3D1259663969' type='text/javascript'%3E%3C/script%3E"));</script>
</html>